<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head >
    <title>搜索管理后台 - 其它信息管理</title>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<script type="text/javascript" src="${request.contextPath}/js/jquery-1.4.2.js"></script>
	<script type="text/javascript" src="${request.contextPath}/js/manager.js"></script>
	<script type="text/javascript" src="${request.contextPath}/js/my97/WdatePicker.js"></script>
	<script type="text/javascript" src="${request.contextPath}/js/jquery.overblock-1.2.js"></script>
		
	<script type="text/javascript">
	$(function(){
		
		$('li.themeLi').hover(function(){
			$(this).find('a.tagsA').fadeIn(0);
		},function(){
			$(this).find('a.tagsA').fadeOut(0);
		});
		
		//点击其他地方，隐藏浮层
		$('body').click(function(e){
			var o = $(e.target);
			if(o.attr('id') == 'gtQuickFloat' || o.parents('#gtQuickFloat').length > 0 || o.attr('class') == 'tagsA'){
				
			}else{
				$('li.themeLi').removeClass('selectedLi');
				$('#gtQuickFloat').hidePop();
			}
		});
		
		//快速查找tags
		$('#gtQuickTagInput').keyup(function(e){
			var v = $(this).val();
			getStartWith(v);
		});
		
		
		$('#cateList1').html('无');
	});
	
	//按前缀匹配获取标签信息
	function getStartWith(v){
		startWith(v, $('#gtQuickView'), function(rs){
			var h = '';
			if(rs && rs.length > 0){
				var list = eval(rs);
				for(var i = 0, len = list.length; i < len; i ++){
					var o = list[i];
					var id = o.id;
					var word = o.keyWord;
					h += '<div class="gtQuickTagDiv" onclick="addTagToThemeGoods(this);">'+word+'<input type="hidden" class="gtQuickTagId" value="'+id+'" /></div>';
				}
			}
			$('#gtQuickView').html(h);
		});
	}
	function startWith(v, obj, func){
		func = func || function(){};
		if(v == null || v.trim().length < 1){
			obj.html('');
		}else{
			v = encodeURI(v);
			ajax('startWith?keyword=' + v, func);
		}
	}
	
	function showGtQuickFloat(thisObj){
		
		var pObj = $(thisObj).parents('li.themeLi');
		pObj.addClass('selectedLi').siblings().removeClass('selectedLi');
		var gsn = pObj.find('input.themeCode').val();
		var floatObj = $('#gtQuickFloat');
		$('#gtQuickThemeCode').val(gsn);
		$('#gtQuickTagIds').val('');
		
		//设置表单编辑标签类型 1打标签   -1删标签
		$('#formType').val(1);
		//设置表单 当前主题code
		$('#formCode').val(gsn);
		//显示当前主题名称
		$('#currentTheme').html(pObj.find('input.themeTitle').val());
		
		var windowHeight = $(window).height()-0+$(window).scrollTop();
		var thisLeft = $(thisObj).position().left - 0;
		var thisTop = $(thisObj).position().top - 0;
		
		var floatLeft = thisLeft - 0 - 280;
		var floatTop = thisTop - 0;
		var floatHeight = floatObj.height() - 0;
		if(floatTop + floatHeight > windowHeight){
			floatTop = floatTop - floatHeight;
		}
		floatObj.css({
			'left' : floatLeft + 'px',
			'top' : floatTop + 'px'
		});
		floatObj.fadeIn(0);
		$('#gtQuickTagInput').focus();
		
	}
	
	function addTagToThemeGoods(obj) {
		var tagId = $(obj).find('.gtQuickTagId').val();
		//设置表单 当前标签的id
		$('#formTagId').val(tagId);
		$('#themeForm').submit();
	}
	</script>
	<style type="text/css">
	#table1{
		border-collapse:collapse;
		width:900px;
	}
	#table1 td{
		border: none;
	}
	.gtQuickTagDiv{
		cursor:pointer;
		font-size:13px;
		text-align:center;
		width:100%px;
		padding-top:4px;
		padding-bottom:4px;
		margin-top:2px;
		margin-bottom:2px;
		background-color:#BAD0FC;
		line-height:22px;
	}
	.divMenu{
		text-align:center;
		font-size:14px;
		font-weight:bold;
		padding-top:11px;
		padding-bottom:10px;
		background-color:#EAF0FF;
		color:#dddddd;
		border-top-left-radius:3px;
		border-top-right-radius:3px;
		width:175px;
		box-shadow: 
		  rgba(12, 12, 12, 0.65) 
		  1px  
		  1px  
		  2px; 
	}
	.divBox{
		background-color:#E1EAFE;
		margin-top:-5px;
		width:900px;
		box-shadow: 
		  rgba(12, 12, 12, 0.65) 
		  2px  
		  2px  
		  4px; 
		border-bottom-left-radius:3px;
		border-bottom-right-radius:3px;
	}
	.divBox0{
		width:900px;
	}
	.menuSelected{
		background-color:#E1EAFE;
		color:black;
		box-shadow: 
		  rgba(12, 12, 12, 0.65) 
		  2px  
		  2px  
		  4px; 
	}
	#cateList1, #userList1{
		padding:20px;
	}
	#cateType{
		padding:2px;
		border-radius:5px;
	}
	.divMenu a{
		text-decoration:none;
	}
	#cateMgr a,#userMgr a{
		color:#dddddd;
	}
	.themeLi {
		background-color:white;
		list-style:none;
		line-height:20px;
		width:720px;
		float:left;
		margin:0px auto 5px 15px;
		padding:5px;
		box-shadow: 
		  rgba(12, 12, 12, 0.65) 
		  1px  
		  1px  
		  3px inset; 
	}
	.themeSpan{
		color:gray;
	}
	.tagsA{
		color:gray;
		font-size:13px;
		float:right;
		margin-right:10px;
		display:none;
	}
	#gtQuickFloat{
		position:absolute;
		width:210px;
		height:300px;
		background-color:white;
		display:none;
		z-index:1000px;
		box-shadow: 
		  rgba(25, 25, 25, 0.85) 
		  2px  
		  2px  
		  5px; 
	}
	.selectedLi{
		border:1px solid red;
	}
	</style>
  </head>
  <body>
  	<div style="margin-top:30px;margin-left:22px;">
		<h3>其它信息管理</h2>
  	</div>
  	<div style="width:950px;height:auto;margin:auto; ">
  		<table id="table1">
  			<tr height="40">
  				<td style="width:180px;">
  					<div class="divMenu" id="cateMgr">
  						<a href="cateIndex">词 库 类 别 管 理</a>
  					</div>
  				</td>
  				<td style="width:170px;">
  					<div class="divMenu" id="userMgr">
  						<a href="userIndex">用 户 信 息 管 理</a>
  					</div>
  				</td>
  				<td style="width:170px;">
  					<div class="divMenu menuSelected" id="themeMgr">
  						<a href="themeIndex">主 题 商 品 管 理</a>
  					</div>
  				</td>
  				<td width="430">&nbsp;</td>
  			</tr>
  			<tr>
  				<td colspan="4">
  					<div class="divBox">
  						<div id="cateBox" class="divBox0">
							<div id="cateList1">
				<#if themes?exists && (themes?size>0) >
					<ul>
					<#list themes as theme>
						<li class="themeLi" >
							<input type="hidden" class="themeCode" value="${theme.themeCode}" />
							<input type="hidden" class="themeTitle" value="${theme.themeTitle}" />
							<div style="font-size:13px;"><span class="themeSpan">主题：</span>${theme.themeTitle} <span class="themeSpan">&nbsp;&nbsp;&nbsp;</span><span style="">${theme.brandCode}</span></div>
							<div style="font-size:13px;word-wrap:break-all;word-break: break-all;width:355px;"><span class="themeSpan">描述：</span>${theme.brief}</div>
							<div style="font-size:13px;">
								<span class="themeSpan">商品数：</span><span>${theme.goodsCount}</span>
								&nbsp;&nbsp;&nbsp;<span class="themeSpan">标签：</span>
								
								<#if theme.tags?exists && (theme.tags?size>0) >
									<#list theme.tags as tag>
										<span>${tag}</span>
									</#list>
								</#if>

								<span>
									<a href="javascript:void(0);" onclick="showGtQuickFloat(this);" class="tagsA">上标签</a>
									<a href="#" class="tagsA">清除标签</a>
								</span>
							</div>
						</li>
					</#list>
					</ul>
					<div style="clear:both;"></div>
					<#else>
					没有主题
				</#if>
							</div>
  						</div>
  					</div>
  				</td>
  			</tr>
  		</table>
  	</div>
  	<div style="padding:50px;"></div>
  	
	<!-- 标签快速预览层 -->
	<div id="gtQuickFloat">
		<div style="padding:10px;">
			<div id="currentTheme" style="font-size:13px;color:red;font-weight:bold;"></div>
			<input type="text" value="" id="gtQuickTagInput" width="100%" />
			<input type="hidden" value="" id="gtQuickThemeCode" />
			<input type="hidden" value="" id="gtQuickTagIds" />
			<div id="gtQuickView" style="margin-top:10px;">
				
			</div>
		</div>
	</div>
	
	<form id="themeForm" method="post" action="etbTheme">
		<input type="hidden" value="" id="formCode" name="themeCodes" />
		<input type="hidden" value="" id="formTagId" name="deltIds" />
		<input type="hidden" value="" id="formType" name="type" />
	</form>
  </body>
</html>
